/*!*********************************************************************************
 * X2Engine Open Source Edition is a customer relationship management program developed by
 * X2 Engine, Inc. Copyright (C) 2011-2019 X2 Engine Inc.
 * 
 * This program is free software; you can redistribute it and/or modify it under
 * the terms of the GNU Affero General Public License version 3 as published by the
 * Free Software Foundation with the addition of the following permission added
 * to Section 15 as permitted in Section 7(a): FOR ANY PART OF THE COVERED WORK
 * IN WHICH THE COPYRIGHT IS OWNED BY X2ENGINE, X2ENGINE DISCLAIMS THE WARRANTY
 * OF NON INFRINGEMENT OF THIRD PARTY RIGHTS.
 * 
 * This program is distributed in the hope that it will be useful, but WITHOUT
 * ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
 * FOR A PARTICULAR PURPOSE.  See the GNU Affero General Public License for more
 * details.
 * 
 * You should have received a copy of the GNU Affero General Public License along with
 * this program; if not, see http://www.gnu.org/licenses or write to the Free
 * Software Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA
 * 02110-1301 USA.
 * 
 * You can contact X2Engine, Inc. P.O. Box 610121, Redwood City,
 * California 94061, USA. or at email address contact@x2engine.com.
 * 
 * The interactive user interfaces in modified source and object code versions
 * of this program must display Appropriate Legal Notices, as required under
 * Section 5 of the GNU Affero General Public License version 3.
 * 
 * In accordance with Section 7(b) of the GNU Affero General Public License version 3,
 * these Appropriate Legal Notices must retain the display of the "Powered by
 * X2 Engine" logo. If the display of the logo is not reasonably feasible for
 * technical reasons, the Appropriate Legal Notices must display the words
 * "Powered by X2 Engine".
 **********************************************************************************/




@import "standards";

.line-items-write {
    #quote-total-section {
        tr td {
            border-bottom: none;
        }
        .input-cell {
            @include border-radius(0 0 4px 0);
        }
        .first-cell {
            @include border-radius(0 0 0 4px);
        }
    }
    #quote-template-dropdown {
        margin-top: 5px;
    }
    .quote-table {
        /* @theme border-color border */

        .input-cell {
            padding-right: 8px;
        }
        input {
            overflow: hidden;
            text-overflow: ellipsis;
            vertical-align: middle;
            margin: 0 0 0 0;
        }
    }
}

.quotes-erriz

::-moz-placeholder {
    text-overflow: ellipsis;
}

.line-items-write {
    .quote-table .add-line-item-button {
        float: left;
    }
    .arrow-both-handle {
      /* @theme color text */
      margin-left: 10px;
      width: 1em;
      height: 1em;
      display: inline-block;
    }

    .add-line-item-button, .add-adjustment-button {
        margin: 0 1em 0 1em;
        width: 12em;
    }
    
    .add-line-item-button.x2-button, .add-adjustment-button.x2-button {
        width: 150px;
        display: inline-block;
        clear: none;
    }
    &.line-items-table .product-menu {
        position: absolute;
        display: none;
        max-height: 16em;
        overflow-y: auto;
        overflow-x: hidden;
        z-index: 5;
        font-size: 10px !important;
        a {
            text-decoration: none;
        }
    }
    .quote-table {
        margin-bottom: 5px;
        width: 100%;
        border-color: #CCCCCC;
        border-width: 1px;
        border-style: solid;
        @include border-radius(4px);

        input.error {
            background: #FEE;
            border-color: #C00 !important;
        }

        .arrow-both-handle {
            margin-left: 10px;
            width: 1em;
            height: 1em;
            display: inline-block;
        }

        .item-delete-button {
            display: inline-block;
        }

        td {
            padding-right: 5px;
            background-color: #FAFAFA;
            /* @theme background-color: content */
            input.line-item-field {
                border: 1px solid #aaa;
                font-size: 12px;
                font-family: Arial, Helvetica, sans-serif;
                padding: 2px;
                box-sizing: border-box;
                @include border-radius(3px);
            }
        }

        > {
            thead:first-child > tr > th {
                border-color: #CCCCCC;
                border-width: 0 0 1px 0;
                border-style: solid;
                text-align: left;
            }
            tbody {
                &.line-items > tr > td.x2-7th-child input, &.adjustments > tr > td.x2-7th-child input {
                    background: none;
                    border: none;
                    color: black;
                    padding: 0px;
                    overflow: hidden;
                    text-overflow: ellipsis;
                }
            }
        }
        input {
            &.total, &.subtotal {
                background: none;
                border: none;
                color: black;
                padding: 0px;
                overflow: hidden;
                text-overflow: ellipsis;
            }
        }
    }
    .line-item > .first-cell, .adjustment > .first-cell {
        width: 10%;
        padding-right: 0;
    }
    .quote-table {
        > {
            tbody.line-items > tr > td.x2-2nd-child {
                text-align: left;
                width: 22%;
                padding-right: 0;
            }
            thead > tr > th.line-item-name, tbody.line-items > tr > td.x2-2nd-child input {
                margin: 0 0 0 0;
                width: 85%;
                float: left;
                font-size: 12px;
            }
        }
        tr.line-item td.input-cell button.product-select-button {
            @include border-radius(0px 4px 4px 0px);
            height: 20px;
            width: 10%;
            max-width: 20px;
            padding: 0 0 0 0;
            margin: 0 0 0 0;
            border-left: none;
        }
    }
    .product-name {
        @include border-radius(4px 0px 0px 4px !important);
    }
    .quote-table {
        .product-select-button img {
            margin: 0 -3px 0 0;
            width: 10px;
            height: 10px;
        }
        > tbody {
            &.line-items > tr > td {
                &.x2-3rd-child {
                    text-align: left;
                    width: 16%;
                    input {
                        width: 100%;
                        text-align: right;
                        font-size: 12px;
                    }
                }
                &.x2-4th-child {
                    text-align: left;
                    width: 12%;
                }
            }
            &.adjustments > tr > td.x2-4th-child {
                text-align: left;
                width: 12%;
            }
            &.line-items > tr > td.x2-4th-child input {
                width: 100%;
                text-align: right;
                font-size: 12px;
            }
            &.adjustments > tr > td.x2-4th-child input {
                width: 100%;
                text-align: left;
                font-size: 12px;
            }
            &.line-items > tr > td.x2-5th-child, &.adjustments > tr > td.x2-5th-child {
                text-align: left;
                width: 12%;
            }
            &.line-items > tr > td.x2-5th-child input, &.adjustments > tr > td.x2-5th-child input {
                width: 100%;
                font-size: 12px;
                text-align: right;
            }
            &.line-items > tr > td.x2-6th-child, &.adjustments > tr > td.x2-6th-child {
                text-align: left;
                width: 12%;
            }
            &.line-items > tr > td.x2-6th-child input, &.adjustments > tr > td.x2-6th-child input {
                width: 100%;
                font-size: 12px;
            }
            &.line-items > tr > td.x2-7th-child, &.adjustments > tr > td.x2-7th-child {
                text-align: left;
                width: 24%;
            }
            &.line-items > tr > td.x2-7th-child input, &.adjustments > tr > td.x2-7th-child input {
                width: 100%;
                font-size: 12px;
            }
        }
        .subtotal-container, .total-container {
            width: 22%;
            text-align: left;
        }
        input {
            &.subtotal, &.total {
                width: 100%;
                font-size: 12px;
            }
        }
    }
}

.quotes-error-summary {
    background: #FEE;
    border: 2px solid #C00;
    font-size: 0.9em;
    padding: 5px;
    margin-bottom: 1px;
    margin-top: 5px;

    color: black !important;

    p {
        margin: 0;
        padding: 5px;
    }
    ul {
        margin: 0;
        padding: 0 0 0 20px;
    }
}


@media (max-width: 657px) {
    .line-items-write .quote-table {
        .input-cell {
            padding-right: 0px;
        }
        .arrow-both-handle {
            margin-left: 0px;
        }
    }
}

.x2-combo-box-dropdown {
    min-width: 186px;
}

